<!doctype html>
<html>

	<head>
		<meta charset="UTF-8" />
		<title>找回密码</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="../css/mui.css" />
		<link rel="stylesheet" href="../css/reg.css" />
		<script src="../js/mui.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" href="../css/common.css" />
		<script type="text/javascript">
			mui.init();
		</script>
		<link rel="stylesheet" href="../css/reg.css" />
		<script type="text/javascript" src="../js/common.js"></script>
	</head>

	<body>
		<div class="mui-content">
			<form class="mui-input-group">
				<div class="mui-input-row">
					<label>手机号码</label>
					<input type="text" class="mui-input-clear phone" placeholder="请输入11位手机号码">
				</div>
				<div class="mui-input-row">
					<label>短信验证</label>
					<input type="text"  placeholder="请输入验证码" id="input_phone_message">
					<button type="button" class="mui-btn mui-btn-danger smsVerifyCode" id="btn_phone_message">获取验证码</button>

				</div>
				<div class="mui-input-row mui-radio reg_type">
					<span>密码类型</span> 登陆密码
					<input type="radio" name="password" value="1" style="margin-top: 0.05rem;" /> 支付密码
					<input type="radio" name="password" value="2" />
				</div>
				<div class="mui-input-row">
					<label>新密码</label>
					<input type="password" class="mui-input-clear p1" placeholder="不少于6位的密码">
				</div>

				<div class="mui-input-row">
					<label>确认密码</label>
					<input type="password" class="mui-input-clear p2" placeholder="请再次确定密码">
				</div>
			</form>
			<div class="mui-content-padded">
				<button id='ok' class="mui-btn mui-btn-block mui-btn-primary">确认</button>
			</div>
		</div>

	</body>

</html>
<script>
	var smsVerifyCode = document.querySelector(".smsVerifyCode");
	smsVerifyCode.addEventListener("tap", function() {
		var reg_phone = document.querySelector(".phone").value;
		var reg1 = /(^1[3|4|5|7|8][0-9]{9}$)/;
		if (reg1.test(reg_phone) == false) {
			mui.toast("请输入正确的手机号码");
			return
		}
		smsVerifyCode.disabled = true;
		var next_time = 60;
		var time_out = setInterval(function() {
			if (next_time == 0) {
				smsVerifyCode.disabled = false;
				smsVerifyCode.innerHTML = "获取验证码";
				clearInterval(time_out);
			} else {
				next_time = next_time - 1;
				smsVerifyCode.innerHTML = next_time;
			}
		}, 1000)
		mui.ajax("/api/v1/sms/send/code", {
			data: {
				paramStr: "{mobile:" + reg_phone + ",ip:127.0.0.1,type:forgetPassword}"
			},
			dataType: 'json',
			type: 'post',
			success: function(data) {
				mui.toast(data.message);
			},
			error: function(xhr, type, errorThrown) {
				//异常处理；
				console.log(type);
			}
		});
	});

	document.getElementById("ok").addEventListener("tap", function() {
		function getRadioBoxValue(radioName) {
			var obj = document.getElementsByName("password");
			for (i = 0; i < obj.length; i++) {
				if (obj[i].checked) {
					return obj[i].value;
				}
			}
			return "undefined";
		}

		var p1 = document.querySelector(".p1").value;
		var p2 = document.querySelector(".p2").value;
		if (p1 != p2) {
			mui.toast("两次输入的密码不一致");
			return
		}

		var phone = document.querySelector(".phone").value;
		var input_phone_message = document.getElementById("input_phone_message").value;

		mui.ajax('/api/v1/user/password/reset', {
			data: {
				paramStr: "{mobile:" + phone + ",smsVerifyCode:" + input_phone_message + ",type:" + getRadioBoxValue() + ",password:" + p2 + "}"
			},
			dataType: 'json',
			type: 'post',
			success: function(data) {

				if (data.code == 200) {
					mui.alert(data.message, jump)

					function jump() {
						mui.openWindow({
							url: 'login.html',
						});
					}
					return
				}
				mui.alert(data.message)
			},
			error: function(xhr, type, errorThrown) {
				//异常处理；
				alert("未知错误")
			}
		});
	});
</script>